import styles from './main.module.scss'
import { defineComponent } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { Back } from '@element-plus/icons-vue'
export default defineComponent({
  name: 'TopBtn',
  props: {
    title: {
      type: String,
      default: ''
    }
  },
  setup(props, { emit, slots }) {
    const { title } = props
    const router = useRouter()
    const route = useRoute()
    const pageType = route.query?.type
    const onRouteBack = () => {
      router.back()
    }
    const onShowName = () => {
      if (title) {
        return title
      } else if (pageType == 'edit') {
        return '编辑任务'
      } else if (pageType == 'look') {
        return '查看任务'
      } else {
        return '新建任务'
      }
    }
    return () => (
      <div class={styles.top_btn}>
        <el-icon class={styles.back_icon} onClick={onRouteBack}>
          <Back />
        </el-icon>
        {onShowName()}
      </div>
    )
  }
})
